<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<%
String contextPath=request.getContextPath();
String basePath=request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+contextPath;
pageContext.setAttribute("basePath",basePath);
request.setAttribute("contextPath", contextPath);
%>
<html >
  <head>
    <meta charset="utf-8">
    <title>慧驾在线书城</title>
    <meta name="查看port" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">
    <script type="text/javascript" src="${basePath }/js/jquery-1.7.2.js"></script>
	<script type="text/javascript">
		function valid(){
			var loginName=$("#loginName").val();
			if(""==loginName){
				//TODO
				return false;
			}
			var button=$("button[type=submit]");
			$.ajax({
				url:"${contextPath}/check/"+loginName,
				type:"get",
				success:function(o){
					if(o && o.result){
						console.log("可以登录");
						$("#errTip").hide();
						button.removeAttr("disabled");
					}else{
						console.log("不可以登录");
						$("#loginName").focus();
						button.attr("disabled","true");
						$("#errTip").show();
					}
				},
				error:function(o){
					alert(o);
				}
			});
		}
	</script>

<!-- Bootstrap style --> 
    <link id="callCss" rel="stylesheet" href="${contextPath }/themes/bootshop/bootstrap.min.css" media="screen"/>
    <link href="${contextPath }/themes/css/base.css" rel="stylesheet" media="screen"/>
<!-- Bootstrap style responsive -->	
	<link href="${contextPath }/themes/css/bootstrap-responsive.min.css" rel="stylesheet"/>
	<link href="${contextPath }/themes/css/font-awesome.css" rel="stylesheet" type="text/css">
<!-- Google-code-prettify -->	
	<link href="${contextPath }/themes/js/google-code-prettify/prettify.css" rel="stylesheet"/>
<!-- fav and touch icons -->
    <link rel="shortcut icon" href="${contextPath }/themes/images/ico/favicon.ico">
    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="${contextPath }/themes/images/ico/apple-touch-icon-144-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="${contextPath }/themes/images/ico/apple-touch-icon-114-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="72x72" href="${contextPath }/themes/images/ico/apple-touch-icon-72-precomposed.png">
    <link rel="apple-touch-icon-precomposed" href="${contextPath }/themes/images/ico/apple-touch-icon-57-precomposed.png">
	<style type="text/css" id="enject"></style>
  </head>
<body>
<div id="header">
<div class="container">
<div id="welcomeLine" class="row">

<!-- 显示在右上角 显示登录用户名 -->
	<div class="span6">Welcome 
		<!-- change -->
		<c:if test="${not empty LOGIN_USER_KEY_IN_SESSION }">
							<b>${LOGIN_USER_KEY_IN_SESSION.userName }</b>
							<h2>
								<a href="${contextPath }/logout" />logout</a>
							</h2>
							<c:if test="${userRole.roleName!='普通用户' }">
								<input type="button" name="manage" value="manage"
									onclick="location=('${contextPath }/admin')" />
							</c:if>
						</c:if>
	</div>

</div>
<!-- Navbar ================================================== -->
<div id="logoArea" class="navbar">
<a id="smallScreen" data-target="#topMenu" data-toggle="collapse" class="btn btn-navbar">
	<span class="icon-bar"></span>
	<span class="icon-bar"></span>
	<span class="icon-bar"></span>
</a>
  <div class="navbar-inner">
  
  <!-- 慧驾书城那个图片 -->
    <a class="brand" href="${contextPath }/index"><img src="${contextPath }/themes/images/logo.png" alt="Bootsshop"/></a>
     
    <ul id="topMenu" class="nav pull-right">

	 <li class="">
	 
	 <!-- 搜索栏     登录按钮 -->
	 <a href="${contextPath }/gotoLogin" role="button" data-toggle="modal" style="padding-right:0"><span class="btn btn-large btn-success">登录</span></a>
	<div id="login" class="modal hide fade in" tabindex="-1" role="dialog" aria-labelledby="login" aria-hidden="false" >
		  <div class="modal-header">
			<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
			<h3>登录框</h3>
		  </div>
		  <div class="modal-body">
			<form class="form-horizontal loginFrm">
			  <div class="control-group">								
				<input type="text" id="inputEmail" placeholder="Email">
			  </div>
			  <div class="control-group">
				<input type="password" id="inputPassword" placeholder="Password">
			  </div>
			  <div class="control-group">
				<label class="checkbox">
				<input type="checkbox"> 记住我
				</label>
			  </div>
			</form>		
			<button type="submit" class="btn btn-success">登录</button>
			<button class="btn" data-dismiss="modal" aria-hidden="true">关闭</button>
		  </div>
	</div>
	</li>
    </ul>
  </div>
</div>
</div>
</div>
<!-- Header End====================================================================== -->

<div id="mainBody">
	<div class="container">
	<div class="row">
<!-- Sidebar ================================================== -->
<div id="sidebar" class="span3">

		<ul id="sideManu" class="nav nav-tabs nav-stacked">
		
			<!-- 左栏     显示所有书、特价书、类别等栏目 -->
			<li><a class="active" href="${contextPath }/showallbooks">所有图书</a></li>
			<li><a href="${contextPath }/showBookSpecials">特价图书</a></li>
			<li class="subMenu open"><a> 所有分类</a>

				<!-- 类别 -->
				<ul>
				<c:forEach items="${category }" var="category">
					<li><a href="${contextPath }/filter/${category.categoryId }"><option>${category.categoryName }</option></a></li>
				</c:forEach>
				</ul>
			</li>
		</ul>
		<br/>
	
		
	</div>
<div class="span9">
    <ul class="breadcrumb">
		<li><a href="index.html">Home</a> <span class="divider">/</span></li>
		<li class="active">Login</li>
    </ul>
	<h3> Login</h3>	
	<hr class="soft"/>
	
	<div class="row">
		<div class="span4">
			<div class="well">
			<h5>CREATE YOUR ACCOUNT</h5><br/>
			Enter your e-mail address to create an account.<br/><br/><br/>
			<form action="${contextPath }/profile/register">
			  <div class="control-group">
				<label class="control-label" for="inputEmail0"></label>
				<div class="controls">
				</div>
			  </div>
			  <div class="controls">
			  <button type="submit" class="btn block">Create Your Account</button>
			  </div>
			</form>
		</div>
		</div>
		<div class="span1"> &nbsp;</div>
		<div class="span4">
			<div class="well">
			<h5>ALREADY REGISTERED ?</h5>
			<form action="${contextPath }/login" method="post">
			  <div class="control-group">
				<label class="control-label" for="inputEmail1">loginName</label>
				<div class="controls">
				  <input class="span3"  type="text" name="loginName" id="loginName" onblur="valid()">
				  <div id="errTip" name="errTip" style="color: red; display: none">此用户不存在,请重新输入</div>
				</div>
			  </div>
			  <div class="control-group">
				<label class="control-label" for="inputPassword1">Password</label>
				<div class="controls">
				  <input type="password" class="span3"  name="password" placeholder="Password">
				</div>
			  </div>
			  <div class="control-group">
				<div class="controls">
				  <button type="submit" class="btn">Sign in</button>
				</div>
			  </div>
			</form>
		</div>
		</div>
	</div>	
</div>

<!-- Footer ================================================================== -->
</body>
</html>